<template>
	<view class="history">

		<view class="bt">
			<u-navbar title="历史订单" :safeAreaInsetTop="true" @rightClick="edit" @leftClick="back">

				<view class="u-nav-slot" slot="left">
					<u-icon name="arrow-left"></u-icon>

				</view>
				<view class="u-nav-slot" slot="right">
					筛选

				</view>
			</u-navbar>
		</view>
		<view class="itd">
			<view class="itemdd" v-for="(item,index) in items" :key="index">
				<itemorderVue :item="item"></itemorderVue>
			</view>
		</view>

		<!-- 	<u-calendar :show="show" :closeOnClickOverlay="true" :mode="mode" @confirm="confirm"
			@close="closecale"></u-calendar> -->
		<u-popup :show="show" @close="close">
			<view>
				<text>请选择日期范围</text>

				<uni-datetime-picker v-model="range" type="daterange" @maskClick="maskClick" @change="confirm" />

			</view>
		</u-popup>
	</view>
</template>

<script>
	import itemorderVue from '../itemorder/itemorder.vue';
	export default {
		components: {
			itemorderVue
		},
		data() {
			return {
				items: [{
					image: "/static/logo.png",
					fwjs: "日常保洁",
					yytime: "2023-10-17 23:00",
					fwstatus: 2,
					address: "北京市北京市昌平区北京市昌平区回龙观街道金燕龙科研楼"
				}, {
					image: "/static/logo.png",
					fwjs: "日常保洁",
					yytime: "2023-10-17 23:00",
					fwstatus: 2,
					address: "北京市北京市昌平区北京市昌平区回龙观街道金燕龙科研楼"
				}, ],
				show: false,
				mode: 'range',
				range: ['2025-02-1', '2025-3-28'],
				datAtime:[]
			}
		},
		methods: {
			confirm(e) {
				// this.show = false
				// console.log(e);
				this.datAtime=this.range
			},
			edit() {
				this.show = true

				// console.log("suiji ");

			},
			close() {
				this.show = false
				this.datAtime=this.range
				// console.log(this.datAtime);
			},
			back() {
				uni.navigateBack()
			},
			maskClick(e) {
				console.log('maskClick事件:', e);
			}
		}
	}
</script>

<style lang="scss">
	.history {
		.bt {}

		.itd {
			margin-top: 63px;


		}


	}
</style>